function draw(element) {
  this.canvas = element;
  this.canvas.width = 150;
  this.canvas.height = 150;
  this.ctx = this.canvas.getContext('2d');
  this.ctx.lineWidth = 1;
  this.ctx.strokeStyle = 'rgb(200, 200, 200)';
  this.vp_resize(150, 150);
}

draw.prototype.vp_resize = function(w, h) {
  var v = w;
  if (v > h) {
    v = h;
  }
  this.canvas.width = v;
  this.canvas.height = v;
  this.ctx.lineCap = 'round';
  this.ctx.setTransform(v / 100.0, 0, 0, -v / 100.0, 0, v);
};

draw.prototype.line = function(x1, y1, x2, y2, r, g, b, w) {
  this.ctx.lineWidth = w;
  this.ctx.strokeStyle = this._rgb(r, g, b);
  this.ctx.beginPath();
  this.ctx.moveTo(x1, y1);
  this.ctx.lineTo(x2, y2);
  this.ctx.stroke();
};

draw.prototype.clear = function(r, g, b) {
  // Store the current transformation matrix
  this.ctx.save();
  // Use the identity matrix while clearing the canvas
  this.ctx.setTransform(1, 0, 0, 1, 0, 0);
  this.ctx.lineWidth = 0;
  this.ctx.fillStyle = this._rgb(r, g, b);
  this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
  // Restore the transform
  this.ctx.restore();
};

// фактически, это не методы, а просто функции

draw.prototype._rgb = function(r, g, b) {
  var p = this._rgb1;
  return 'rgb(' + p(r) + ',' + p(g) + ',' + p(b) + ')';
};

draw.prototype._rgb1 = function(c) {
  c *= 2.55;
  c = c < 0 ? 0 : c > 255 ? 255 : c;
  return Math.floor(c);
};
